<%@ page contentType="text/html;charset=utf-8" language="java"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/jquery-1.11.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/plupload.full.min.js"></script>
<script type="text/javascript" src="js/qiniu.js"></script>
<script type="text/javascript" src="js/zh_CN.js"></script>
<script type="text/javascript" src="js/highlight.js"></script>
<title>导游_约导游</title>
<!--css-->
<body>
<div id="up_bg_img_parentId">
            <input name="" type="button" value="选择图片上传" id="aaaId" onClick="up_bg_img.click()" class="upload"/>
	             	<input type="file" name="up_bg_img"  class="uploading" id="up_bg_img" style="display:none;"/>
	                <input type="hidden" id="backgroundValId"></input>
	                <div class="process-bar skin-blue" style="display:block;" id="processbarId">
					     <div class="pb-wrapper">
						     <div class="pb-highlight"></div>
						     <div class="pb-container">
							     <div class="pb-text" id="processbarVal1Id">0%</div>
							     <div class="pb-value" id="processbarVal2Id" style="width:0%"></div>
						     </div>
					     </div>
					 </div>
</div>
</body>
 <script>
//*********************start****************************
var chars = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];

function generateMixed(n) {
    var res = "";
    for(var i = 0; i < n ; i ++) {
        var id = Math.ceil(Math.random()*35);
        res += chars[id];
    }
    return res;
}
$(function(){
	loadImgOpt("up_bg_img_parentId","backgroundValId","up_bg_img","pkId");
});
 function getUpToken() {
 	var objp={};
 	var token = "";
 	 $.ajax({
 		  url: 'http://localhost:8080/guide/core/getUpToken',
 		  type: 'POST',
 		  timeout: 30000,
 		  cache : false,
 	      data :objp,
 	      async: false,
 		  success:function(msg){
 			  //setCardInfo(msg.cardInfo)
 			  token =  msg.uptoken;
 			  alert(token);
 		   },
 		   failure:function(msg){
 			   alert(eval('('+msg.responseText+')').error_text);
 		   		
 		   },
 		   error:function(msg){
 			   alert(eval('('+msg.responseText+')').error_text); 
 		   }
 	});
 	 return token;
 }
 function loadImgOpt(parentId,backgroundValId,btn,pkId) {
 var wei7 = generateMixed(7); 	
 var uptokenStr = getUpToken();
 var uploader = Qiniu.uploader({
     runtimes: 'html5,flash,html4',    //上传模式,依次退化
     browse_button: btn,       //上传选择的点选按钮，**必需**
     //uptoken_url: '/youoor/core/getUpToken',            //Ajax请求upToken的Url，**强烈建议设置**（服务端提供）
     // downtoken_url: '/downtoken',
     // Ajax请求downToken的Url，私有空间时使用,JS-SDK将向该地址POST文件的key和domain,服务端返回的JSON必须包含`url`字段，`url`值为该文件的下载地址
     uptoken : uptokenStr, //若未指定uptoken_url,则必须指定 uptoken ,uptoken由其他程序生成
     // unique_names: true, // 默认 false，key为文件名。若开启该选项，SDK会为每个文件自动生成key（文件名）
     // save_key: true,   // 默认 false。若在服务端生成uptoken的上传策略中指定了 `sava_key`，则开启，SDK在前端将不对key进行任何处理
     domain: 'http://guide.qiniudn.com/',   //bucket 域名，下载资源时用到，**必需**
     container: parentId,          //上传区域DOM ID，默认是browser_button的父元素，
     max_file_size: '100mb',           //最大文件体积限制
     flash_swf_url: 'js/Moxie.swf',  //引入flash,相对路径
     silverlight_xap_url:"js/Moxie.xap",
     max_retries: 3,                   //上传失败最大重试次数
     //dragdrop: true,                   //开启可拖曳上传
     //drop_element: 'container',        //拖曳上传区域元素的ID，拖曳文件或文件夹后可触发上传
     chunk_size: '4mb',                //分块上传时，每片的体积
     auto_start: true,   
     unique_names: false ,
     save_key: false,//选择文件后自动上传，若关闭需要自己绑定事件触发上传,
     init: {
         'FilesAdded': function(up, files) {
             plupload.each(files, function(file) {
                 // 文件添加进队列后,处理相关的事情
             	uploader.start();
             	return true;
             });
         },
         'BeforeUpload': function(up, file) {
                // 每个文件上传前,处理相关的事情
                alert(11);
         	 $('#processbarId').css("display","inline-block");
         },
         'UploadProgress': function(up, file) {
                // 每个文件上传时,处理相关的事情
              //  alert(file.percent);
             $('#processbarVal1Id').html(file.percent + "%");
             $('#processbarVal2Id').css("width",file.percent + "%");
         },
         'FileUploaded': function(up, file, info) {
                // 每个文件上传成功后,处理相关的事情
                // 其中 info 是文件上传成功后，服务端返回的json，形式如
                // {
                //    "hash": "Fh8xVqod2MQ1mocfI4S4KpRL6D98",
                //    "key": "gogopher.jpg"
                //  }
                // 参考http://developer.qiniu.com/docs/v6/api/overview/up/response/simple-response.html

                 //var domain = up.getOption('domain');
                /// var res = parseJSON(info);
                // var sourceLink = domain + res.key;// 获取上传成功后的文件的Url
               
               // $("#backgroundId").attr("src",imgDomain+loginUserId+"_"+wei7+file.name);
               // $("#backgroundId").css("width",185);
               alert(123+"_"+wei7+file.name);
                //$("#"+backgroundValId).val(123+"_"+wei7+file.name);
                //$("#headImgId").attr("src",imgDomain+loginUserId+"_"+wei7+file.name);
               // uploadHeadImg(backgroundValId,pkId);
                
         },
         'Error': function(up, err, errTip) {
        	 alert(err.code+"--"+err.message);
         	$('#processbarId').css("display","none");
         	
                //上传出错时,处理相关的事情
         },
         'UploadComplete': function() {
                //队列文件处理完毕后,处理相关的事情
         	$('#processbarId').css("display","none");
                
         },
         'Key': function(up, file) {
             // 若想在前端对每个文件的key进行个性化处理，可以配置该函数
             // 该配置必须要在 unique_names: false , save_key: false 时才生效
             var key = 123+"_"+wei7+file.name;
             // do something with key here
             return key
         }
     }
 });
 }
 /************end*******************/
 
 
 
 </script>
</html>
